<script setup lang="ts">
import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper'

// 检查是否在qiankun环境中运行
const isInQiankun = qiankunWindow.__POWERED_BY_QIANKUN__
</script>

<template>
  <div class="app-container">
    <!-- 只有在独立运行时才显示导航 -->
    <nav v-if="!isInQiankun">
      <router-link to="/app2/home">Home</router-link>
      <router-link to="/app2/about">About</router-link>
    </nav>
    
    <!-- 微前端环境提示 -->
    <div v-if="isInQiankun" class="qiankun-env-tip">
      🔄 正在qiankun微前端环境中运行 - App2
    </div>
    
    <!-- 路由视图 -->
    <router-view />
  </div>
</template>

<style scoped>
.app-container {
  width: 100%;
  min-height: 100vh;
}

nav {
  display: flex;
  gap: 15px;
  padding: 15px;
  background-color: #f0f0f0;
  margin-bottom: 20px;
}

router-link {
  text-decoration: none;
  padding: 8px 12px;
  border-radius: 4px;
  background-color: #2196f3;
  color: white;
}

router-link:hover {
  background-color: #1976d2;
}

.qiankun-env-tip {
  padding: 10px;
  background-color: #e3f2fd;
  color: #1976d2;
  text-align: center;
  margin-bottom: 20px;
}
</style>
